<template>
  <h3>组合api-Provide/Inject</h3>
  <button @click="fn">btn</button>
  <Child />
</template>

<script>
import Child from "./10-child.vue";
import { provide, ref } from "vue";
export default {
  components: {
    Child,
  },
  setup() {
    const count = ref(5);
    // 现在的依赖注入是具有响应式的，传递的值需要是响应式数据
    // provide两个参数分别是key和value
    provide("count", count);

    const fn = () => {
      count.value++;
    };

    return {
      fn,
    };
  },
};
</script>
